<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title>年级</title>
	<link rel="stylesheet" href="../css/layui.css">
<link rel="stylesheet" href="/scriptZIP/layui.min.css">
	<link rel="stylesheet" href="../css/item.css">
	<link rel="stylesheet" href="../css/popup.css">

	<style>
		.layui-row {
			margin-top: 50px;
		}
		[v-if] {
			display: none;
		}

	</style>
</head>

<body>

	<form class="layui-form">
		<div class="layui-row" id="vue-root">
			<div class="layui-col-md6 layui-col-md-offset3">
				<div class="layui-form-item">
					<label class="layui-form-label" v-t="'学员姓名'"></label>
					<div class="layui-input-block">
						<input name="gradeName" v-validate="'required'" :data-vv-as="$t('学员姓名')" autocomplete="off"
							:placeholder="$t('请输入')+$t('学员姓名')" class="layui-input gradename" v-model="item.name" disabled>
						<div class="checkout_state" v-text="err('gradeName')">
						</div>
					</div>
				</div>

				<div class="layui-form-item">
					<label class="layui-form-label" v-t="'校区'"></label>
					<div class="layui-input-block">
						<select name="teacherName" :data-vv-as="$t('校区')" class="input_select classteacher"
							id="teacher" v-model="item.schoolId" disabled>
							<option :value="undefined" disabled="disabled">{{$t('请选择')+$t('校区')}}</option>
							<option v-for="school in schools" :key="school.id" :value="school.id"
								v-text="school.name">
							</option>
						</select>
						<div class="checkout_state" v-text="err('teacherName')"></div>
					</div>
				</div>

				<div class="layui-form-item">
					<label class="layui-form-label">家校共建激励方案</label>
					<div class="layui-input-block">
						<div style="padding: 0 0px 4px 45px;font-weight: bold;" v-if="textareaList.length">
							<div class="textoverflow" style="width: 72%;"
								v-for="(textItem,i) in textareaList.slice(0,3)" :key="i">
								{{i+1}}、{{textItem.content}}
							</div>
						</div>
						<div style="padding-left: 45px;">
							<textarea placeholder="请输入备注信息" class="layui-textarea text"
								v-model="textareaValue"></textarea>
						</div>
						<div style="padding-left: 35px;">
							<button type="button" class="layui-btn layui-btn-normal layui-btn-sm"
								@click="addtext()">添加跟进记录</button>
							<button type="button" v-if="textareaList.length" class="layui-btn layui-btn-normal layui-btn-sm"
								@click="viewtext()">查看</button>
						</div>
					</div>
				</div>


				<div class="layui-form-item">
					<div class="layui-input-block">
						<div class="offer" @click="submit" v-t="'立即提交'"></div>
						<div class="return" onclick="history.back()" v-t="'取消'"></div>
					</div>
				</div>

			</div>
			
			<div v-if="show" class="model-table5" @click="show=false">
				<div class="popup" @click.stop>
					<div class="popup-title">家校共建激励方案</div>
					<div class="popup-center">
						<div class="genjinjilu_box" v-for="(jilu,i) in textareaList">
							<div class="textarea1">({{i+1}})、{{jilu.content }}</div>
							<div class="shijian">
								<span>时间：{{jilu.times}}</span>
								<span style="margin-left: 10px;">跟进人：{{jilu.username}}</span> 
							</div>
						</div>
					</div>
					<div style="margin: 20px 0;display: flex;justify-content: center;">
						<button class="notice-btn" @click="show=false">关闭</button>
					</div>
				</div>
			</div>
		</div>
	</form>

	<script src="/scriptZIP/qs.min.js"></script>
	<script src="/scriptZIP/vue.min.js"></script>
	<script src="/scriptZIP/axios.min.js"></script>
	<script src="/scriptZIP/dayjs.min.js"></script>

	<script src="/js/common.js"></script>
	<script src="/js/item.js"></script>
	<script src="/js/i18n.js"></script>

	<script>

		setI18n({
			立即提交: 'submit',
			取消: 'cancel',
			请输入: 'Please enter ',
			请选择: 'Please choose ',
			年级名称: 'Grade name',
			年级主任: 'Grade Director'
		});
		var id = params().id;
		var app = new Vue(merge({
			data: {
				item: {
					schoolId: top_params().id
				},
				schools: [],
				show:false,
				textareaList: [],
				textareaValue: '',
			},
			created: function () {
				
				axios.get('/pc/student/' + id).then(function (res) {
					this.item = res.data;
					if(res.data.incentiveScheme)  this.textareaList=res.data.incentiveScheme;
				}.bind(this));

				axios.get('/pc/school/all/' + this.item.schoolId).then(function (res) {
					this.schools = res.data;
				}.bind(this));

				// this.init();
			},
			methods: {
				viewtext: function () {
						this.show=true
					},
					addtext: function () {
						if (!this.textareaValue) return alert('请填写内容')
						var name= localStorage.getItem('staffUserName')
						var obj = { username: '', content: '', times: '' }
						obj.content = this.textareaValue
						obj.username = name!='null'?name:sessionStorage.getItem('hxt-u')
						obj.times = dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss')
						this.textareaList[0]=obj;
						this.textareaValue = ''
					},
					submit:function(){
						var success = function () {
							alert(locale == 'en' ? 'succeed' : '成功');
							history.back();
						};
						var obj={}
						if (this.textareaList.length) {
							obj.incentiveScheme=this.textareaList
						}
						obj.id=id;
						axios.post('/pc/student/studentXqUd', obj).then(success);


					}

			},

			i18n: i18n
		}));
	</script>

</body>

</html>